<template>
  <div>
    <template v-if="!toStation">
      <el-button style="position: absolute;right: 35px" type="primary" @click="submitDetailForm">
        <svg-icon :icon-class="'save'" class="mr5"/>
        保存
      </el-button>
      <el-button plain style="position: absolute;right: 110px" type="danger" @click="emptyItem()">
        <template #icon>
          <i-ep-delete-filled/>
        </template>
        清空
      </el-button>
    </template>
    <template v-else>
      <el-button plain style="position: absolute;right: 35px" type="success" @click="templateQuote">
        <svg-icon class="mr5" icon-class="save"/>
        引用
      </el-button>
    </template>
  </div>

  <el-row style="margin-right: 400px">
    <el-form ref="formRef" :model="form" :rules="rules" label-width="100px">
      <el-row>
        <el-col :span="5">
          <el-form-item label="通知部门" label-width="80" prop="tongzhibumen">
            <el-input v-model="form.tongzhibumen" class="width-120"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="5">
          <el-form-item label="接听人员" label-width="80" prop="jietingrenyuan">
            <el-input v-model="form.jietingrenyuan" class="width-120"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="5">
          <el-form-item label="出诊部门" label-width="80" prop="chuzhenbumen">
            <el-input v-model="form.chuzhenbumen" class="width-120"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="9">
          <el-form-item label="通知内容" label-width="80" prop="tongzhineirong">
            <el-input v-model="form.tongzhineirong"/>
          </el-form-item>
        </el-col>
        <el-col :span="9">
          <el-form-item label="出诊位置" label-width="80" prop="chuzhenweizhi">
            <el-input v-model="form.chuzhenweizhi"/>
          </el-form-item>
        </el-col>
        <el-col :span="9">
          <el-form-item label="病史提供者" label-width="80" prop="bingshitigongzhe">
            <el-input v-model="form.bingshitigongzhe"/>
          </el-form-item>
        </el-col>
        <el-col :span="5">
          <el-form-item label="可靠程度" label-width="80" prop="kekaochengdu">
            <el-input v-model="form.kekaochengdu"/>
          </el-form-item>
        </el-col>
        <el-col :span="24">
            <el-form-item label="主诉" prop="zhusu">
            <el-input v-model="form.zhusu" placeholder="请输入内容" type="textarea" maxlength="256" show-word-limit/>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="现病史" prop="xianbingshi">
            <el-input v-model="form.xianbingshi" placeholder="请输入内容" rows="3" type="textarea" maxlength="256" show-word-limit/>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="既往史" prop="jiwangshi">
            <el-input v-model="form.jiwangshi" placeholder="请输入内容" rows="3" type="textarea" maxlength="256" show-word-limit/>
          </el-form-item>
        </el-col>
      </el-row>
    
      <el-row>
        <el-divider content-position="left"><span class="divider-css">▶体格检查◀</span></el-divider>
        <el-col :span="24">
          <el-form-item>
            <el-col :span="4">
              <el-form-item class="tigejiancha" label="T:" label-width="80px" prop="tiwen">
                <el-input v-model="form.tiwen" class="tigejiancha-input" clearable placeholder="体温"
                          style="width:120px">
                  <template #append>℃</template>
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="4">
              <el-form-item class="tigejiancha" label="P:" label-width="80px" prop="maibo">
                <el-input v-model="form.maibo" class="tigejiancha-input" clearable placeholder="脉搏"
                          style="width:120px">
                  <template #append>次/分</template>
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="5">
              <el-form-item class="tigejiancha" label="R:" label-width="120px" prop="huxi">
                <el-input v-model="form.huxi" class="tigejiancha-input" clearable placeholder="呼吸"
                          style="width:120px">
                  <template #append>次/分</template>
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="7">
              <el-form-item class="tigejiancha" label="BP:" label-width="115px">
                <el-input v-model="form.systolicPressure" class="tigejiancha-input" clearable
                          placeholder="收缩压" style="width:60px"/>
                <span style="margin:0 15px 0 25px">/</span>
                <el-input v-model="form.diastolicPressure" class="tigejiancha-input" clearable
                          placeholder="舒张压" style="width:60px">
                  <template #append>mmHg</template>
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="3">
              <el-form-item class="tigejiancha" label="Sp02:" label-width="135px" prop="sp02">
                <el-input v-model="form.sp02" class="tigejiancha-input" clearable placeholder=""
                          style="width:120px">
                </el-input>
              </el-form-item>
            </el-col>
          </el-form-item>
        </el-col>
        <el-col :span="5">
          <el-form-item label="神志" label-width="80" prop="shenzhi">
            <el-input v-model="form.shenzhi"/>
          </el-form-item>
        </el-col>
        <el-col :span="5">
          <el-form-item label="精神状态" label-width="80" prop="jinshenzhuangtai">
            <el-input v-model="form.jinshenzhuangtai"/>
          </el-form-item>
        </el-col>
        <el-col :span="5">
          <el-form-item label="皮肤色泽" label-width="80" prop="pifuseze">
            <el-input v-model="form.pifuseze"/>
          </el-form-item>
        </el-col>
        <el-col :span="5">
          <el-form-item label="睑结膜" label-width="80" prop="jianjiemo">
            <el-input v-model="form.jianjiemo"/>
          </el-form-item>
        </el-col>
        <el-col :span="5">
          <el-form-item label="巩膜黄染" label-width="80" prop="gongmohuangran">
            <el-input v-model="form.gongmohuangran"/>
          </el-form-item>
        </el-col>
        <el-col :span="5">
          <el-form-item label="对光反射" label-width="80" prop="duiguangfanshe">
            <el-input v-model="form.duiguangfanshe"/>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item class="tigejiancha" label="瞳孔直径大小" label-width="120" prop="sex">
            <el-form-item class="tigejiancha">
              <el-input v-model="form.tongkongzhijingzuo" class="tigejiancha-input" clearable
                        placeholder="左" style="margin:0 0px 0 5px;width:50px"/>
              <span style="margin:0 12px 0 25px">/</span>
              <el-input v-model="form.tongkongzhijingyou" class="tigejiancha-input" clearable
                        placeholder="右" style="width:50px">
              </el-input>
            </el-form-item>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="其他" label-width="80" prop="">
            <el-input v-model="form.other" maxlength="256" rows="3" show-word-limit type="textarea"/>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="初步诊断" label-width="80" prop="chubuzhenduan">
            <el-input v-model="form.chubuzhenduan" maxlength="256" show-word-limit/>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="流病调查" label-width="80" prop="liubingdiaocha">
            <el-input v-model="form.liubingdiaocha"/>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="病情判断" label-width="80" prop="bingqingpanduan">
            <el-input v-model="form.bingqingpanduan"/>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="急救措施" label-width="80" prop="jijiucuoshi">
            <el-input v-model="form.jijiucuoshi" maxlength="512" rows="3" show-word-limit type="textarea"/>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="备注" label-width="80" prop="remarks">
            <el-input v-model="form.remarks" maxlength="256" rows="3" show-word-limit type="textarea"/>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="转送上级医院" label-width="90" prop="zhuansong">
            <el-input v-model="form.zhuansong" maxlength="256" show-word-limit/>
          </el-form-item>
        </el-col>
      </el-row>

    </el-form>
  </el-row>
</template>

<script lang="ts" setup>
import {posiNactiveNumber, positiveNumber} from "@/utils/myRules.ts";
import {
  addTemplateAmbulanceStationDetail,
  listTemplateAmbulanceStationDetail,
  updateTemplateAmbulanceStationDetail
} from "@/api/patient/templateAmbulanceStationDetail.ts";
import {useUserStoreHook} from "@/store/modules/user.ts";

const emits = defineEmits(["templateQuote"])
const props = defineProps({
  toStation: {
    type: Boolean,
    default: false
  }
})

const useUserStore = useUserStoreHook();
// 登录用户信息
const userInfo = <UserInfoBusi>useUserStore.user.userInfo;
const formRef = ref()
const form = ref<any>({
  tongzhibumen: "",
  jietingrenyuan: "",
  chuzhenbumen: "",
  chuzhenweizhi: "", 
  tongzhineirong: "",
  bingshitigongzhe: "本人及家属",
  kekaochengdu: "", 
  zhusu: "",
  liuxingbingshi: "",
  xianbingshi: "",
  jiwangshi: "",
  tiwen: "",
  maibo: "",
  huxi: "",
  xueya: "",
  systolicPressure: "",
  diastolicPressure: "",
  sp02: "",
  shenzhi: "",
  jinshenzhuangtai: "",
  pifuseze: "",
  jianjiemo: "",
  gongmohuangran: "",
  duiguangfanshe: "",
  tongkongzhijingzuo: "",
  tongkongzhijingyou: "",
  other: "",
  other2: "",
  chubuzhenduan: "",
  liubingdiaocha: "",
  bingqingpanduan: "",
  jijiucuoshi: "",
  orgId: userInfo.orgId,
  remarks: "",
  zhuansong: "",
})

const rules = ref<any>({
  
})


// 主表行点击事件
function rowClickClick(row: any) {
  emptyItem()
  // nextTick(() => {
    listTemplateAmbulanceStationDetail({"templateMasterId": row.templateMasterId}).then((res: resType) => {
    if (res.data && res.data.length > 0) {
      form.value = res.data[0]
    }
  })
  form.value.templateMasterId = row.templateMasterId
  // })
}

/**
 * 保存
 */
function submitDetailForm() {
  (formRef.value as any).validate(valid => {
    if (valid) {
      ElMessageBox.confirm('确认要保存吗？',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning',
        }
      ).then(() => {
        if (form.value.ambulanceStationDetailId != null) {
          updateTemplateAmbulanceStationDetail(form.value).then(() => {
            ElMessage.success("修改成功");
          }).finally(() => {
          });
        } else {
          addTemplateAmbulanceStationDetail(form.value).then(() => {
            ElMessage.success("新增成功");
          }).finally(() => {
          });
        }
      })
    }
  })
}

/**
 * 清空
 */
function emptyItem() {
  form.value = ({
  tongzhibumen: "",
  jietingrenyuan: "",
  chuzhenbumen: "",
  chuzhenweizhi: "", 
  tongzhineirong: "",
  bingshitigongzhe: "本人及家属",
  kekaochengdu: "",
  zhusu: "",
  liuxingbingshi: "",
  xianbingshi: "",
  jiwangshi: "",
  tiwen: "",
  maibo: "",
  huxi: "",
  xueya: "",
  systolicPressure: "",
  diastolicPressure: "",
  sp02: "",
  shenzhi: "",
  jinshenzhuangtai: "",
  pifuseze: "",
  jianjiemo: "",
  gongmohuangran: "",
  duiguangfanshe: "",
  tongkongzhijingzuo: "",
  tongkongzhijingyou: "",
  other: "",
  other2: "",
  chubuzhenduan: "",
  liubingdiaocha: "",
  bingqingpanduan: "",
  jijiucuoshi: "",
  orgId: userInfo.orgId,
  remarks: "",
  zhuansong: "",
  })
}

// 模板引用 -》调用子页面进行勾选数量校验
function templateQuote() {
  emits("templateQuote", form.value)
}

defineExpose({
  rowClickClick,
  emptyItem
})

</script>

<style scoped>

.tigejiancha {
  margin-left: -10px;
}

:deep(.tigejiancha-input) {
  margin-left: -10px
}

:deep(.tigejiancha-input .el-input__wrapper .el-input__inner) {
  width: 60px
}

:deep(.el-input-group__append) {
  width: 40px;
  padding: 0 5px;
}

</style>
